<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			#d1{
				margin-top: 40px;
				position: relative;
			}
			ul.nav{
				display: flex;
				
				list-style: none;
			}
			ul.nav li{
				border-right: 2px solid black;
				width: 100px;
			}
			ul.nav a{
				font-size: 20px;
				color: black;
				text-decoration:none;
			}
			
			#d1 #zhuan{
				position: absolute;
				width: 38px;
				height: 23px;
				top: -17px;
				left: 36px;
				background: url(resources/header_03.png) no-repeat;
			}
			@keyframes myframe{
				from{width: 38px;}
				20%{width: 43px;}
				40%{width: 49px;}
				60%{width: 56px;}
				80%{width: 62px;}
				to{width: 66px;}
			}
			#d1 #zhuan:hover{
				animation: myframe 0.6s;
				background: url(resources/header_05.png) no-repeat;
				width: 66px;
			}
		</style>
	</head>
	<body>
		<div id="d1">
			<ul class="nav">
				<li>
					<a href="#">返回商场</a>
				</li>
				<li></li>
				<li></li>
				<li></li>
				<li></li>
			</ul>
			<div id="zhuan">
				<!-- <img src="resources/header_03.png"/> -->
			</div>	
		</div>
	</body>
</html>
